a {
	color: #0066cc;
	font-size: 14px;
	text-decoration: none;
	outline: none;
}
.iphone_p p{
	margin: 0;
	padding: 0;
}

ul{
	list-style: none;
}
li{
	
	list-style: none;
	
}

body {
	background-color: #f5f5f7;
}

/*购买按钮样式*/
.button1 {
	display: block;
	width: 60px;
	height: 30px;
	color: #fff;
	background-color: #0071e3;
	border: none;
	border-radius: 200px;
	font-size: 17px;
	margin:14px;
	line-height: 30px;
}

sup {
	font-size: 12px;

}

/*******************************a统一***********************************************/
/* a 连接文字 */
.button2 {
	text-decoration: none;
	color: #2997ff;
	font-size: 17px;
	margin: 2vh;
}

/* a便签下划线 */
.button2:hover {
	text-decoration: underline;
}

/* a后面> */
.button2::after {
	content: ">";
	font-size: 17px;
}

/************** 红色字体*********************** */
.text1 {
	color: #f56300;
	font-size: 12px;
	margin-bottom: 2vh;
}

/* *********************************************1楼样式****************************************************** */
.f1 {
	text-align: center;
	/* 背景设置 */
	background-color: #f5f5f7;
}

.f1 .box {
	background-color: #fff;
}

.f1 .f1-1-1 {
	border-bottom: #f5f5f5 15px solid;
	padding-top: 80px;
}

.f1 .f1-1-2 {
	border-bottom: #f5f5f5 15px solid;
	padding-top: 80px;
}

/********************* 1楼下的第一小块 和二小块***************************/
.f1 .f1-2 .text {
	margin-right: 200px;

}

.f1 .text p {
	font-weight: 600;
	color: #000000;
	font-size: 40px;
	margin-bottom: 2vh;
	font-weight: 400;
}

.f1 .text span {
	display: block;
	font-weight: 600;
	color: #3e3e40;
	font-size: 24px;
	margin: 40px 0;
	font-weight: 500;

}

.f1 .text ul {
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0 auto;
}

/******************** 1楼下的第3小块*********************/
.f1 .f1-2 {
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #fbfbfd;
}

.f1 .f1-2 .text {
	margin-right: 200px;


}

.f1 .f1-2 .text p {
	font-weight: 600;
	color: #3357cc;
	font-size: 56px;
	margin-bottom: 2vh;
}

.f1 .f1-2 .text span {
	font-weight: 600;
	color: #000000;
	font-size: 24px;
	margin-bottom: 2vh;

}

.f1 .f1-2 .text ul {
	display: flex;
	justify-content: center;
	margin: 2vh auto;
}

.f1 .f1-2 .text img {
	background-color: #f5f5f5;
}


/* *******************************************************2楼样式 ********************************************/
.button {
	display: block;
	width: 100px;
	color: #000000;
	background-color: #ffffff;
	border-radius: 50px;
	font-size: 20px;
	margin: 5px;
	padding: 0px;
	line-height: 50px;
	text-align: center;
}

.f2 {
	display: flex;
	border-radius: 20px;
	width: 1380px;
	height: 836px;
	/* background-image: url(./img/guided_tour__c40f88on9o8y_small_2x.jpg); */
	align-items: center;
	background-size: 100%;
	margin: 0 auto;
	margin-top: 20px;
}

.f2 .f2-1 {
	color: #f5f5f5;
	margin-bottom: 5px;
	font-size: 25px;
	margin-left: 100px;
}

/***********************************3楼样式***********************************************/
.small {
	background-color: #fff;
}

.small .center {
	width: 1380px;
	margin: 0 auto;
	background-color: #fff;

}

.small .f1 {
	width: 1380px;
	margin: 0 auto;
	background-color: #fff;
}

.small .center .f1-1 {
	width: 940px;
	background-color: #fff;
	margin: 0 auto;
	box-sizing: border-box;
	padding-top: 115px;
	text-align: center;
	padding-bottom: 105px;
}

.small .f1 .center .box1 {
	margin: 0 auto;
	margin-bottom: 200px;
	max-width: 940px;
	font-size: 56px;
	font-weight: 600;
}

.small .f1 .center .box2 {
	margin-top: 68px;
	margin-bottom: 73px;
	width: 940px;
	height: 1416px;
	display: flex;
	justify-content: space-between;
	align-content: space-between;
	flex-wrap: wrap;
}
.small .f1 .mini .text{
	margin-top: 35px;
}
.small .f1 .mini .text div{
	margin-top: -22px;
}
.small .f1 .center .box2 div {
	text-align: center;
	width: 209.5PX;
}

.small .f1 .center .box2 .pro,
.air,
.ipad,
.mini {
	height: 500px;
	padding-bottom: 32px;
	border-bottom: 1px solid #d2d2d7;
}

.small .f1 .center .box2 .pro .text p,
.air .text p,
.ipad .text p,
.mini>.text p {
	font-size: 20px;
	font-weight: 400;
}

.small .f1 .center .box2 {
	font-size: 14px;
	font-weight: 400px;
}

.small .f1 .center .box2 .text div {
	display: flex;
	justify-content: center;
	align-items: flex-end;
}

.small .f1 .center .box2>div>div:nth-child(1) {
	height: 214px;
	display: flex;
	justify-content: center;
	align-items: flex-end;
	margin-bottom: 13px;
}

.small .f1 .center .box2>div .text {
	height: 203px;
	display: flex;
	flex-flow: column;
	justify-content: space-between;
	align-items: center;
}

.small .f1 .center .box2>div>p {
	font-size: 17px;
	font-weight: 600;
	margin-bottom: 6px;
}

.small .f1 .center .box2>div>img {
	margin-bottom: 6px;
}

.small .f1 .center .box2>div .text .u2 {
	margin-bottom: 40px;
}

.small .f1 .center .box2>div .text .u3 {
	margin-bottom: 15px;
}

.small .f1 .center .box2 .ul {
	padding-bottom: 45px;
	border-bottom: 1px solid #d2d2d7;
}

.small  .f1 .box{
	display: flex;
}

/* ************************4楼样式的 ***********************************/
.f4 .center {
	width: 1380px;
	margin: 0 auto;
}

.f4 h2 {
	text-align: center;
	font-size: 36px;
	margin: 70px;
	font-weight: 600;
}

.f4 .center .row {
	display: flex;
	justify-content: center;
	text-align: center;

}

.f4 .box1 {
	width: 655px;
	height: 756px;
	background-color: #fff;
	margin-right: 20px;
}

.f4 .box1 img {
	margin-top: 120px;
}

.f4 .box2 {
	width: 655px;
	height: 756px;
	overflow: hidden;
	background-color: #fff;
}

.f4 .box2 img {
	margin-top: 55px;
	margin-left: -160px;

}
.f4 .row{
	margin-bottom: 200px;
}
.f4 .row h3 {
	font-size: 36px;
	font-weight: 500;
	padding-top: 52px;
}

.f4 .row p {
	width: 470px;
	margin: 25px auto;
}

.f4 .row1 {
	margin: 25px;
	height: 600px;
	/* background-image: url(./img/why_apple__ezn1ktvka6oi_large_2x.jpg); */
	background-size: cover;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
}

.f4 .row1 h3 {
	font-size: 40px;
	margin: 25px;
}

.f4 .row1 p {
	width: 400px;
	margin-bottom: 25px;
}

.f4 .row2 {
	margin: 25px;
	height: 600px;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	background-size: 100%;
	background-position-y: bottom;
	background-color: #fff;
	padding-top: 50px;
	padding-bottom: -10px;
}

.f4 .row2 h3 {
	font-size: 40px;
	margin-bottom: 30px;
	
}

.f4 .row2 p {
	width: 400px;
	margin-bottom: 25px;
}

.f4 .row2 div {
	margin-top: -300px;
}

/*********************************5楼****************************************************/
.f5 .center {
	width: 1380px;
	margin: 0 auto;
}

.f5 h2 {
	text-align: center;
	font-size: 36px;
	margin: 70px;
	font-weight: 600;
}

.f5 h3 {
	text-align: center;
	font-size: 36px;
	margin: 35px;
	font-weight: 600;
}

.f5 .box1 {
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	height: 530px;
	background-color: #fff;
	margin: 20px;
}

.f5 .box1 img {
	width: 633px;
	height: 463px;
	margin-top: 70px;
}

.f5 .box1 p {
	margin-bottom: 15px;
}

.f5 .box1 .text {
	margin-right: 200px;
	margin-left: 200px;
}

.f5 .box2 {
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	height: 530px;
	background-color: #fff;
	margin: 20px;
}

.f5 .box2 img {
	width: 805px;
	height: 530px;
}

.f5 .box2 p {
	margin-bottom: 15px;
}

.f5 .box2 .text {
	margin-right: 100px;
	margin-left: 100px;
}

.f5 .box3 {
	height: 500px;
	/* background: url(./img/airpods__eb24cvhoe26a_large_2x.jpg) no-repeat center; */
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	background-size: 100%;
	background-color: #fff;
	margin: 20px;
	padding: 30px 0;
}

.f5 .box3 div {
	margin-top: -280px
}

.f5 .box3 p {
	margin-bottom: 15px;
}

.f5 .air {
	height: 100px;
	text-align: center;
	margin-top: 52px;
	border: 1px solid transparent;
}

/*********************************六楼**************************************************************/
.f6 .center {
	width: 1380px;
	margin: 0 auto;
}

.f6 {
	margin-bottom: 86px;
	border: none
}

.f6 .center .box {
	padding: 86px 0;
	display: flex;
	justify-content: space-around;
	border: none
}

.f6 .center .box div {
	text-align: center;
	width: 260px;
}

.f6 .center .box div p {
	margin: 10px 0;
}

.f6 .center .text {
	text-align: center;
}

.f6 .center .text h2 {
	font-size: 56px;
	font-weight: 600;
}

/******************************************7楼*******************************************************/
.f7 .center {
	width: 1380px;
	margin: 0 auto;
}

.f7 .row {
	height: 480px;
	/* background: url(./img/ios15_banner__dw5dqawzsuoi_large.jpg) no-repeat center; */
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	background-size: 100%;
	background-color: #fff;
	margin: 20px;
}

.f7 .row .box h3 {
	color: #fff;
	font-size: 32px;
}

.f7 .row .box p {
	color: #fff;
	margin: 20px;
}

.f7 .row .box a {
	color: #fff;
}

.f7 .row1 {
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
}

.f7 .row1 h3 {
	font-size: 32px;
}

.f7 .row1 .box1 h3 {
	margin-top: 20px;
}

.f7 .row1 .box1 {
	text-align: center;
	background-color: #fff;
	width: 675px;
	margin: 20px;

}

.f7 .row1 .box1 img {
	width: 100%;
	overflow: hidden;
}

.f7 .row1 .box2 {
	width: 675px;
	height: 469px;
	/* background: url(img/privacy_update__cc6s1lqakkk2_large.jpg) no-repeat center; */
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	background-size: 100%;
	background-color: #fff;
	margin: 20px;
}

.f7 .row1 .box2 h3 {
	margin-top: -150px;
	color: #fff;
}

.f7 .row1 .box2 a {
	margin: 25px;
	color: #fff;
}



/************************************8楼**************************************/
.f8 .center {
	width: 1380px;
	margin: 0 auto;
}

.f8 .center .text1 {
	background-color: #f5f5f7;
	text-align: center;
	padding-bottom: 100px;
	font-size: 56px;
	font-weight: 600;
	color: #000;
}
.f8 .center .text1 p{
	margin-top: 70px;
}
.f8 .center .box1 {
	color: #f5f5f7;
	display: flex;
	justify-content: space-between;
	background-color: #000;
	align-items: center;
	margin-bottom: 30px;
}

.f8 .box1 .text {
	width: 675px;
	text-align: center;
}

.f8 .box1 .text h2 {
	font-size: 48px;
	font-weight: 600;
	padding: 15px 0;
}

.f8 .box1 .text a {
	padding-top: 15px;
}

.f8 .box2 {
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	height: 530px;
	background-color: #fff;
}

.f8 .box2 .img {
	width: 633px;
	height: 463px;
	margin-top: 70px;
}

.f8 .box2 p {
	font-size: 36px;
	margin-bottom: 15px;
	font-weight: 600;
}

.f8 .box2 .text {
	margin-right: 200px;
	margin-left: 200px;
}



/******************************8楼轮播图***************************/
.f8 .f8-1{
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	margin: 20px;
}
.f8 .box1{
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	background-color: #fff;
	width: 1380px;
}
.f8 .f8-2{
	margin-left:300px;
}
.f8 .f8-2 img {
	width: 90px;
	height: 60px;
	background-color: #00FFFF;
}

/* area是带边框的外层 */


.f8-3{
	float: left;
	overflow: hidden;
	height: 496px;
	display: flex;
	text-align: center;
	justify-content: center;
	align-items: center;
	background-color: #ffffff;
	margin-left: 400px;
}

.f8-3 .area {
	width: 690px;
	margin: 30px 0;
	border: 1px solid #666;
	overflow: hidden;
	background-color: #ffffff;
	border: none;
}

/* ul样式是重点，ul中要包裹很多图片，这些图片横向移动，形成滚动效果 */
.f8-3 .area ul {
	display: flex;
	width: 8000px;
	animation: move 30s infinite linear;
	font-size: 0;
}

.f8-3 .area ul:hover {
	animation-play-state: paused;
}

.f8-3 .area ul li img:hover {
	transform: scale(1.4);
	border: 1px #000000 solid;
}

.f8-3 .area ul li {
	margin: 10px;
	width: 100%;
}

.f8-3 .area ul li img {
	display: block;
	width: 180px;
	margin: 0 auto;
}


.f8-3 .area ul li p {
	text-align: center;
	font-size: 12px;
}

@keyframes move {
	/* 0% {没动可以不写} */
	/* 100% {transform: translateX(-1000px);} */
	/* 变换当中使用百分比相对于的是自己
	 这里移动的是ul,所以是ul的50%也就是1000px*/

	100% {
		transform: translateX(-50%);
	}
}
